.intelligent-detail {
    padding: 12px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    .detail-container {
        width: 100%;
        height: 100%;
        .header {
            height: 56px;
            padding: 0  16px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            background-color: #fff;
            margin-bottom: 12px;
            position: sticky;
            top: 0;
            background-color: #fff;
            z-index: 999;
            .title {
                font-size: 16px;
                font-weight: 500;
                color: #262626;
            }
            .act {
                &-group {
                    height: inherit;
                    display: flex;
                    align-items: center;
                    flex-direction: row;
                    gap: 12px;
                    .work {
    
                    }
                    .disabled {
    
                    }
                }
                &-edit {
    
                }
                &-more {
    
                }
            }
        }
        .content {
            // height: calc(100% - 96px);
            min-height: calc(100% - 96px);
            display: flex;
            gap: 12px;
            .head {
                height: 42px;
                background-color: #F7F8F8;
                display: flex;
                align-items: center;
                padding-left: 20px;
                color: #262626;
                font-size: 16px;
                font-weight: 400;
            }
            &_left {
                flex: 1;
                overflow: hidden;
                // min-width: 570px;
                background-color: #fff;
                &_item {
                    padding: 24px 16px;
                    // .form-view-row-content.imgList {
                    //     display: flex;
                    //     gap: 8px;
                    //     flex-wrap: wrap;
                    // }
                    // .form-view-row-content-imgItem {
                    //     width: 60px;
                    //     height: 60px;
                    //     .imgItem {
                    //         width: 100%;
                    //         height: 100%;
                    //     }
                    // }
                }
            } 
            &_right {
                flex: 1;
                // min-width: 570px;
                background-color: #fff;
                &_item {
                    padding: 24px;

                }
            }
        }
    }
}
.content_right_item {
    .head-action {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 24px;
        &-title {
            font-size: 16px;
            font-weight: 500;
            color: #262626;
        }
        &-select {
            display: flex;
            color: #595959;
            .active {
                color: $color-primary;
            }
            .time-range {
                &-select {
                    display: flex;
                    gap: 12px;
                    &>* {
                        cursor: pointer;
                    }
                }
            }
        }
    }
    .showList {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 16px;

        .item {
            height: 93px;
            border-radius: 12px;
            background-color: #FAFAFA ;
            padding: 16px 24px;
            
            .top {
                height: 22px;
                font-size: 14px;
                font-weight: 500;
                color: #262626;
                line-height: 22px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .bottom {
                height: 39px;
                font-size: 24px;
                font-weight: 400;
                color: #262626;
            }
            &:nth-child(1),&:nth-child(2),&:nth-child(3) {
                flex: 0 0 calc((100% / 3) - 16px);
                width: calc((100% / 3) - 16px);
            }
            &:nth-child(4),&:nth-child(5),&:nth-child(6) {
                flex: 0 0 calc((100% / 3) - 16px);
                width: calc((100% / 3) - 16px);
            }
            &.cursor {
                outline: 1px solid #CBD6E2;
                cursor: pointer;
            }
            &.active {
                background-color: $color-primary-light-1;
                outline: 1px solid $color-primary-light-6;
            }
        }
    }
    .chart {

    }
}